<template>
  <el-dialog :title="title" :visible.sync="dialogFormVisible" width="500px" @close="close" append-to-body>
    <!-- <el-descriptions title="" :column="1" size="medium" border labelStyle="width:100px;">
      <el-descriptions-item>
        <template slot="label">
          <i class="el-icon-chat-dot-square"></i>
          反馈要求
        </template>
        kooriookami
      </el-descriptions-item>    
      

    </el-descriptions> -->
    <el-form ref="form" :model="form" :rules="rules" label-width="100px" class="margintop">
      <el-row :gutter="20"> 
        <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
          <el-form-item label="反馈要求">
            <el-input v-model.trim="form.feedback_require" type="textarea" :rows="5" disabled></el-input>
          </el-form-item>
        </el-col>   
        <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
          <el-divider content-position="left">反馈内容</el-divider>
        </el-col>
        <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
          <el-form-item label="反馈描述">
            <el-input v-model.trim="form.feedback_desc" type="textarea" :rows="5" disabled></el-input>
          </el-form-item>
        </el-col>
        
        <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
          <el-form-item label="附件下载" v-if="filesList.length > 0">
            <el-upload ref="uploadPicture"
                       class="upload-demo"
                       action=""
                       :auto-upload="false"
                       :on-preview="handlePreview"
                       :multiple="true" disabled
                       :file-list="filesList"
            >
            </el-upload>

          </el-form-item>

        </el-col>      
        <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
          <el-form-item label="得分" prop="point">
            <el-input v-model.trim="form.point" autocomplete="off" type="number" :min="0" @change="getValue"></el-input>
          </el-form-item>
        </el-col>
        <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
          <el-form-item label="扣分项" >
            <el-select v-model="form.list" multiple placeholder="请选择" style="width: 100%;">
              <el-option
                  v-for="item in options"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div slot="footer" class="dialog-footer" style="text-align:center;">
      <el-button type="success" @click="tongguo" :loading="loading1" :disabled="disabled1">{{ loading1 ? '通过中 ...' : '通 过' }}</el-button>
      <el-button type="primary" @click="save" :loading="loading" :disabled="disabled">{{ loading ? '保存中 ...' : '保 存' }}</el-button>
      <el-button type="danger" @click="bohui" :loading="loading2" :disabled="disabled2">{{ loading2 ? '驳回中 ...' : '驳 回' }}</el-button>
      <el-button @click="close">关 闭</el-button>    
      
    </div>
  </el-dialog>
</template>

<script>
import {getOneDeptDetail,saveDeptPoint,passDeptPoint,backDeptPoint,getOneFile} from "@/api/warningOrder";
import {getAllList} from "@/api/warningDeductPoints"
import {download} from "@/api/warningOrderDept";

export default {
  name: 'dcEdit',
  data() {
    return {
      form: {
        id: '',
        point: '',
        feedback_require: '',
        feedback_desc: '',
        list: [],
      },
      rules: {
        point: [
          { required: true, trigger: 'blur', message: '请输入得分' },
        ],
      },
      title: '',
      dialogFormVisible: false,
      loading: false,
      disabled: false,
      loading1: false,
      disabled1: false,
      loading2: false,
      disabled2: false,
      filesList: [],
      options: [],
      value1: [],
    }
  },
  created() { },
  methods: {
    showDia(row) {
      if (!row) {
        this.title = '添加'
      } else {
        this.title = '督查'
        this.form = Object.assign({}, row)
        this.getOneById();
        this.getAllList();
      }
      this.dialogFormVisible = true
    },
    handleChange(value) {
      let cityNames = []
      value.forEach((e) => {
        cityNames.push(CodeToText[e])
      })
      this.citys = cityNames.join('/')
    },
    close() {
      this.filesList = [];
      this.$refs['form'].resetFields()
      this.form = this.$options.data().form
      this.dialogFormVisible = false
    },
    save() {
      if (this.loading) {
        return
      }
      if (this.form.point < 0) {
        this.$baseMessage('分值不能小于0', 'warning')
        return;
      }
      this.$refs['form'].validate(async (valid) => {
        if (valid) {
          this.loading = true
          this.disabled = true
          this.disabled1 = true
          this.disabled2 = true
          saveDeptPoint(this.form).then((res) => {
            if (res.code == 0) {
              this.timer = setTimeout(() => {
                setTimeout(() => {
                  this.loading = false
                  this.disabled = false
                  this.disabled1 = false
                  this.disabled2 = false
                }, 400)
                this.$baseMessage("保存成功", 'success')
                this.$emit('fetch-data')
                this.close()
              }, 2000)
            }else {
              this.timer = setTimeout(() => {
                setTimeout(() => {
                  this.loading = false
                  this.disabled = false
                  this.disabled1 = false
                  this.disabled2 = false
                }, 400)
                this.$baseMessage(res.msg, 'error')
              }, 2000)
            }
          })
        } else {
          return false
        }
      })
    },
    tongguo() {
      console.log("from.list",this.form.list)
      if (this.loading1) {
        return
      }
      if (this.form.point < 0) {
        this.$baseMessage('分值不能小于0', 'warning')
        return;
      }
      this.$refs['form'].validate(async (valid) => {
        if (valid) {
          this.loading1 = true
          this.disabled1 = true
          this.disabled = true
          this.disabled2 = true
          passDeptPoint(this.form).then((res) => {
            if (res.code == 0) {
              this.timer = setTimeout(() => {
                setTimeout(() => {
                  this.loading1 = false
                  this.disabled1 = false
                  this.disabled = false
                  this.disabled2 = false
                }, 400)
                this.$baseMessage("审批成功", 'success')
                this.$emit('fetch-data')
                this.close()
              }, 2000)


            }else {

              this.timer = setTimeout(() => {
                setTimeout(() => {
                  this.loading1 = false
                  this.disabled1 = false
                  this.disabled = false
                  this.disabled2 = false
                }, 400)
                this.$baseMessage(res.msg, 'error')

              }, 2000)
            }

          })
        } else {
          return false
        }
      })
    },
    bohui() {
      if (this.loading2) {
        return
      }
      if (this.form.point < 0) {
        this.$baseMessage('分值不能小于0', 'warning')
        return;
      }
      this.$refs['form'].validate(async (valid) => {
        if (valid) {
          this.loading2 = true
          this.disabled2 = true
          this.disabled = true
          this.disabled1 = true
          backDeptPoint(this.form).then((res) => {
            if (res.code == 0) {
              this.timer = setTimeout(() => {
                setTimeout(() => {
                  this.loading2 = false
                  this.disabled2 = false
                  this.disabled = false
                  this.disabled1 = false
                }, 400)
                  this.$baseMessage("已驳回", 'success')
                  this.$emit('fetch-data')
                  this.close()
                }, 2000)
            }else {
              this.timer = setTimeout(() => {
                setTimeout(() => {
                  this.loading2 = false
                  this.disabled2 = false
                  this.disabled = false
                  this.disabled1 = false
                }, 400)
                this.$baseMessage(res.msg, 'error')

              }, 2000)
            }
          })
        } else {
          return false
        }
      })
    },
    async getOneById(){
      const { data } = await getOneDeptDetail(this.form);
      this.form = data;
      //属性信息 附件
      if (data.files) {
        data.files.forEach((x) => {
          this.filesList.push({ name: x.file_name, url: x.id })
        })
      }
      console.log("files",this.filesList)
    },
    handlePreview(file) {
      this.$baseSeeOrDown('请选择操作？', null, async () => {
        download(file.url).then((res) => {
          const url = window.URL.createObjectURL(new Blob([res]))
          const link = document.createElement('a')
          link.href = url
          link.setAttribute('download', file.name)
          console.log("link",link)
          document.body.appendChild(link)
          link.click()
        })
      },async () => {
        var fileName = file.name
        if (fileName.indexOf(".pdf") === -1 && fileName.indexOf(".jpg") === -1 && fileName.indexOf(".png") === -1 && fileName.indexOf(".jpeg") === -1){
          this.$baseMessage('此类型文件不支持预览', 'error')
        }else {
          let fileId = file.url;
          var x = {}
          x.id = fileId;
          getOneFile(x).then((res) => {
            window.open(res.data.file_path)
          })
        }

      })
    },
    getValue(val){
      console.log('val',val)
      if(val.indexOf(".") !== -1){
        this.form.point = '';
        this.$baseMessage('分数只能是正整数', 'warning')
      }
    },
    getAllList(){
      getAllList().then((res) => {
        var list = res.data;
        this.options = [];
        for (var i = 0; i < list.length; i++){
          var x  = {};
          x.value = list[i].id;
          x.label = list[i].name;
          this.options.push(x);
        }

      })
    }
  },
}
</script>
<style lang="scss" scoped>
 .margintop{margin-top:13px;}
 ::v-deep{
  .el-divider__text{font-size:14px;font-weight:bold;}
  .el-descriptions__header{margin-bottom:10px;}
 }
</style>
